<template>
  <div class="edit-menu">
    <a-modal
      :title="modifyTitles"
      width="500px"
      :visible="visibles"
      :confirm-loading="confirmLoading"
      @ok="handleSubmit"
      @cancel="handleCancel"
    >
      <a-spin :spinning="requestSpinning" tip="正在加载数据中...">
        <a-form :form="form" :label-col="{ span: 5 }" :wrapper-col="{ span: 17 }">
          <a-form-item label="参数名称">
            <a-input
              v-decorator="['PmName',{
                rules: [
                  { required: true, message: '', whitespace: true, trigger: 'change' },
                ]
              }]"
              placeholder="请输入参数名称" />
          </a-form-item>
          <a-form-item label="唯一key值">
            <a-input
              v-decorator="['PmKey',{
                rules: [
                  { required: true, message: '', whitespace: true, trigger: 'change' },
                ]
              }]"
              placeholder="请输入唯一key值" />
          </a-form-item>
          <a-form-item label="状态">
            <a-switch
              v-decorator="['PmEnable', { valuePropName: 'checked', initialValue: true }]"
              checked-children="启用"
              un-checked-children="停用"
            />
          </a-form-item>
          <a-form-item label="排序值">
            <a-input-number v-decorator="['PmSort', { initialValue: '' }]" :min="0" placeholder="排序值" />
          </a-form-item>
          <a-form-item label="备注">
            <a-textarea v-decorator="['PmBreak', { initialValue: '' }]" placeholder="请输入备注"></a-textarea>
          </a-form-item>
        </a-form>
      </a-spin>
    </a-modal>
  </div>
</template>

<script>
import { setParameters, getParameterInfo } from '@/api/common'
import moment from 'moment'
export default {
  props: {
    visibles: {
      type: Boolean,
      default: false
    },
    propsData: {
      type: Object,
      default: () => {
        return {}
      }
    }
  },
  data () {
    return {
      confirmLoading: false,
      requestSpinning: false,
      form: this.$form.createForm(this, { name: 'parameter' })
    }
  },
  computed: {
    modifyTitles: function () {
      return this.propsData.type === 'add' ? '新增参数' : '修改参数'
    }
  },
  watch: {
    propsData: function () {
      const { propsData: { type } } = this
      if (type === 'update') {
        this.fetchData()
      }
    }
  },
  methods: {
    fetchData () {
      const { propsData: { id: ParameterID }, form: { setFieldsValue }, $message } = this
      this.requestSpinning = true
      getParameterInfo({ ParameterID }).then(res => {
        this.$nextTick(function () {
          setFieldsValue({
            PmKey: res.data.PmKey,
            PmName: res.data.PmName,
            PmBreak: res.data.PmBreak,
            PmEnable: res.data.PmEnable === '1'
          })
        })
      }).catch((err) => {
        $message.error(err)
      }).finally(() => {
        this.requestSpinning = false
      })
    },
    handleSubmit () {
      const { form: { validateFields }, propsData: { type, id: ID } } = this
      validateFields((err, values) => {
        if (!err) {
          this.confirmLoading = true
          setParameters({
            State: type,
            sys_parameter_Modules: Object.assign({}, values, {
              ID,
              PID: '0',
              PmSort: values.PmSort,
              PmEnable: values.PmEnable ? '1' : '0',
              CreateTime: moment(new Date()).format('YYYY-MM-DD HH:mm:ss'),
              CreateUserID: this.$store.getters.userid,
              CreateUserName: this.$store.getters.name,
              Mode: 0
            })
          }).then(res => {
            if (res.code === 200) {
              this.$message.success('添加参数成功', 3)
              this.handleCancel()
              this.$parent.$parent.$refs.table.refresh(true)
            } else {
              this.$message.error(res.msg, 3)
            }
          }).catch(() => {
            this.$message.error('添加参数失败', 3)
          }).finally(() => {
            this.confirmLoading = false
          })
        }
      })
    },
    handleCancel () {
      this.form.resetFields()
      this.$emit('update:visibles', false)
    }
  }
}
</script>
